<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<jsp:include page="/WEB-INF/views/layouts/header.jsp"/>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
// 网站地址
String netPath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort();
%>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<script type="text/javascript">
function doSubmit(){
	$("[name=flag]").val("");
	$("[validate='true']").each(function(){
		validate(this);
	});
	if($("[name=flag]").val()==="true"){
		
	}else{
		$.ajax({
			  url: "<%=basePath%>account/createOperatorSave",
			  type:"POST",
			  contentType:"application/x-www-form-urlencoded; charset=utf-8",
			  data:$('#form0').serialize(),
			  success: function(data) {
				 var jsonobj=eval('('+data+')');
				 if(jsonobj.state==='1'){
					 window.location.href="<%=basePath%>account/user";
				 }else if(jsonobj.state==='0'){
					 alert(jsonobj.result);
				 }
			  },
			  error: function(XMLHttpRequest, textStatus, errorThrown) {
					 alert("创建失败！");
			  }
		});
	}	
}
function initUserForm(){
	$('#password').passwordStrength({
		targetDiv: $(".safe_schedule")
	});
}
function validate(obj){
	var dataRequired = $(obj).attr("data-required");
	var dataType = $(obj).attr("data-type");
	var validateType = $(obj).attr("validate_type");
	if(dataRequired&&dataRequired==="true"){
		if(!$(obj).val()){
			var nullMessage = $(obj).attr("null-message");
			$(obj).next().text(nullMessage);
			$("[name=flag]").val("true");
		}else{
			$(obj).next().text("");
		}
	}
	if(dataType&&dataType==="lengthLimit"){
		var minLength = $(obj).attr("min-length")*1;
		var maxLength = $(obj).attr("max-length")*1;
		var message = $(obj).attr("message");
		if(message&&$(obj).val()){
			if($(obj).val().length<minLength||$(obj).val().length>maxLength){
				$(obj).next().html(message);
				$("[name=flag]").val("true");
			}else{
				$(obj).next().html("");
			}
		}else{
			if($(obj).val().length<minLength||$(obj).val().length>maxLength){
				$(obj).next().removeClass().addClass("cuered");
				$("[name=flag]").val("true");
			}else{
				$(obj).next().removeClass().addClass("cuegray");
			}
			
		}
	}
	if(validateType==="account"){
		var rew = /^[a-zA-Z][a-zA-Z0-9_]{5,15}$/;
		if(!rew.test($(obj).val())){
			$(obj).next().removeClass().addClass("cuered");
			$("[name=flag]").val("true");
		}else{
			$(obj).next().removeClass().addClass("cuegray");
		}
	}
	if(validateType==="email"){
		if($(obj).val()){
			var rew = /\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/;
			if(rew.test($(obj).val())){
				$(obj).next().removeClass().addClass("cuegray");
				$(obj).next().text("*选填");
			}else{
				$(obj).next().removeClass().addClass("cuered");
				$(obj).next().text("邮箱格式不正确！");
				$("[name=flag]").val("true");
			}
		}else{
			$(obj).next().removeClass().addClass("cuegray");
			$(obj).next().text("*选填");
		}
	}
	if(validateType==="phone"){
		if($(obj).val()){
			var rew = /^1[3|4|5|8][0-9]\d{8}$/;
			if(rew.test($(obj).val())){
				$(obj).next().removeClass().addClass("cuegray");
				$(obj).next().text("*选填");
			}else{
				$(obj).next().removeClass().addClass("cuered");
				$(obj).next().text("手机号码格式不正确！");
				$("[name=flag]").val("true");
			}
		} else {
			$(obj).next().removeClass().addClass("cuegray");
			$(obj).next().text("*选填");
		}
	}
	if(validateType==="confirmPassword"){
		var prevPassword = $("[name=passwd]").val();
		if($(obj).val()&&prevPassword){
			if($(obj).val()!==prevPassword){
				$(obj).next().text("两次输入的密码不一致！");
				$("[name=flag]").val("true");
			}else{
				$(obj).next().text("");
			}
		}
	}
}
function loadPostion(obj){
	var value = $(obj).val();
	if(value){
		$.ajax({
			  url: "<%=basePath%>account/positionsInDepartment",
			  type:"GET",
			  contentType:"application/x-www-form-urlencoded; charset=utf-8",
			  data:"departmentId="+value,
			  success: function(data) {
				 var jsonArray=eval(''+data+'');
				 var operator = $("[name=positionId]");
				 var html="<option value=''></option>";
				 for(var i=0;i<jsonArray.length;i++){
					 html+="<option value='"+jsonArray[i].positionId+"'>"+jsonArray[i].name+"</option>"
				 }
				 operator.html(html);
			  },
			  error: function(XMLHttpRequest, textStatus, errorThrown) {
					 alert("加载人员失败！");
			  }
		});
	}
}
$(document).ready(function(){
	initUserForm();
	$("[validate='true']").bind('blur', function() {
	  	validate(this);
	});
});
</script>

<!--中间部分开始-->
<div class="main">
  <!-- 左侧 -->
  <jsp:include page="/WEB-INF/views/account/sidebar.jsp"/>
  <!-- /左侧 -->
  <!-- 核心内容区域 -->
<div id="iaas_layout_content" class="rightblock">
    <p class="shadow"></p>
    <div class="content"><!--默认状态下引用样式ml60，展开后引用样式ml140-->
      <div class="mainblock">
        <div class="tabA">
          <h1>创建新用户</h1>
        </div>
        <div class="zhgl_1 zhxxxg">
          <h5>帐户信息</h5>
          <form:form id="form0"  method="POST" modelAttribute="operator" validate="true" action="/account/createOperatorSave">
          <table width="100%" border="0" cellpadding="0" cellspacing="0">
            <tr>
              <td width="8%"><p>姓名：</p></td>
              <td width="92%">
              		<form:input path="name" validate="true" data-required="true" null-message="姓名不能为空 ！" data-type="lengthLimit" min-length="1" max-length="20" message="姓名不允许超过20个字符！"  />
                	<span class="cuered"></span>
                	<form:hidden path="operatorId"    />
                	<input type="hidden" name="flag" value="" />
               </td>
            </tr>
<%--             <tr>
              <td><p>部门：</p></td>
              <td>
              	<label>
                  <select name="department" onchange="loadPostion(this)" validate='true' data-required="true" null-message="部门不能为空 ！">
	                  <option value=""></option>
	                  <c:forEach items="${allDepartmentList}" var="department">
				          	<option value="${department.departmentId}">${department.name}</option>
				      </c:forEach>
                  </select>
                  <span class="cuered"></span>
                </label>
                 
               </td>
            </tr>
            <tr>
              <td><p>职位：</p></td>
              <td><select name="positionId" validate='true' data-required="true" null-message="职位不能为空 ！">
                  <option value=""></option>
                </select>
                <span class="cuered"></span>
              </td>
            </tr> --%>
            <tr>
              <td><p>角色：</p></td>
              <td>
                  <form:select path="groupId" validate='true' data-required="true" null-message="角色不能为空 ！">
                  		<form:option value=""></form:option>
	                  <c:forEach items="${operatorGroupsList}" var="operatorGroups">
				          	<form:option value="${operatorGroups.groupId}">${operatorGroups.groupName}</form:option>
				      </c:forEach>
                  </form:select>
                  <span class="cuered"></span>
              </td>
            </tr>
            <tr>
              <td><p>邮箱：</p></td>
              <td>
              	<form:input path="email" validate="true"  class="required" validate_type="email"  message="邮箱格式不正确！"  />
                <span class="cuegray">*选填</span>
              </td>
            </tr>
            <tr>
              <td><p>手机：</p></td>
              <td>
              	<form:input path="mobile" validate="true"  class="required" validate_type="phone"  message="手机号码格式不正确！"  />
                <span class="cuegray">*选填</span>
              </td>
            </tr>
          </table>
        </div>
		<div class="zhgl_1 mmxg">
          <h5>注册账号</h5>
          <table width="100%" border="0" cellpadding="0" cellspacing="0">
            <tr>
              <td width="8%"><p>用户名：</p></td>
              <td width="92%"><form:input path="loginName" validate="true" AUTOCOMPLETE="off" validate_type="account" data-type="lengthLimit" min-length="6" max-length="20"  />
                <span class="cuegray">用户名由6-16位半角字符（字母、数字、符号）组成，区分大小写</span></td>
            </tr>
            <tr>
              <td><p>密码：</p></td>
              <td>
              	<form:password id="password" path="passwd" validate="true" AUTOCOMPLETE="off" class="required" data-type="lengthLimit" min-length="6" max-length="20" value="" message='<img src="<%=basePath%>images/wrong.png">密码长度不正确，应为6-16个字符' />
              	<span class="cuered"></span></td>
            </tr>
            <tr>
              <td>&nbsp;</td>
              <td><dl>
                  安全强度
                </dl>
                <div class="safebg">
                  <div class="safe_schedule is0"></div>
                </div></td>
            </tr>
            <tr>
              <td><p>确认密码：</p></td>
              <td><input type="password" name="confirmPassword" AUTOCOMPLETE="off" validate_type="confirmPassword" validate="true" class="required" data-type="lengthLimit" min-length="6" max-length="20" message='<img src="<%=basePath%>images/wrong.png">密码长度不正确，应为6-16个字符' />
                <span class="cuered"></span></td>
            </tr>
            
          </table>
          </form:form>
        </div>
        <div class="btnblock ">
          <input name="Input" type="button" value="保 存" class="btngreen01 linkhand" onclick="doSubmit()"/>
        </div>
      </div>
    </div>
  </div>
</div>
<!--中间部分结束-->
<!--底部开始-->
<jsp:include page="/WEB-INF/views/layouts/footer.jsp"/>
<!--底部结束-->

</body>
</html>
